{% extends 'layout.html' %}
{% load static %}
{% load permission %}
{% load color %}
{% block css %}
<style>
.messages_error {
    position: fixed;
    left: 0;
    right: 0;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
    top: 0;
}

</style>
{% endblock %}
{% block content %}
{% if messages %}
    <div class="top-message-error messages_error">
    {% for obj in messages %}
    <div class="alert alert-{{ obj.level_tag }}" >
      <strong>{{ obj.message }}
    </div>
    {% endfor %}
    </div>
{% endif %}

<div style="margin-bottom: 5px" class="clearfix">
{#    {% add_permission request 'customer_charge_add' %}#}
<a href="{% url 'my_order_add' %}" class="btn btn-success"><span class="glyphicon glyphicon-plus-sign"></span>
    创建订单</a>

<form class="form-inline right" method="get">
  <div class="form-group">
    <label class="sr-only" for="exampleInputEmail3">搜索</label>
    <input type="text" name="keyword" class="form-control" id="exampleInputEmail3" placeholder="请输入需要查找的内容" value="{{ keyword }}">
  </div>
  <button type="submit" class="btn btn-default glyphicon glyphicon-search"></button>
</form>

</div>
    <table class="table table-bordered">
        <thead>
        <tr>
            <th>订单号</th>
            <th>视频地址</th>
            <th>数量</th>
            <th>价格</th>
            <th>原播放分量</th>
            <th>创建时间</th>
            <th>状态</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {% for row in pager.queryset %}
            <tr>
                <td>{{ row.oid }}</td>
                <td>{{ row.url }}</td>
                <td>{{ row.count }}</td>
                <td>{{ row.price }}</td>
                <td>{{ row.old_view_count }}</td>
                <td>{{ row.create_time|date:"Y-m-d" }}</td>
                <td>{{ row.get_status_display }}</td>
                <td><a href="{% url 'my_order_cancel' pk=row.id %}" class="btn btn-danger btn-xs">撤销订单</a></td>
            </tr>
        {% endfor %}

        </tbody>
    </table>

<nav aria-label="Page navigation">
  <ul class="pagination">
    {{ pager.html }}
  </ul>
</nav>

{% endblock %}
{% block js %}
    <script>
        setTimeout(function () {
            $(".top-message-error").addClass('hide');
        }, 5000);
    </script>
{% endblock %}


